<template
>
  <view
    @tap="sheep.$router.go('/pages/order/detail-takeout',{order_sn:order.order_sn})"
    class="ss-p-20 ss-r-10 bg-white ss-flex justify-between ss-m-20 align-start"
    v-for="(order,index) in dataList"
    :key="index"
  >
    <view class="img-box">
      <image
        style="width:114rpx;height:114rpx;"
        :src="order?.store?.thumb"
      ></image>
    </view>

    <view style="flex:1">
      <view
        class="ss-flex ss-p-y-38 ss-p-x-10 ss-m-b-20"
        style="border-bottom: 2rpx solid #EFEFEF; justify-content:space-between"
      >
        <view
          class="font-3 ss-line-1 font-w"
          style="width:370rpx"
        >{{order?.store?.name||'-'}}</view>
        <view
          class="font-1"
          style="color:#FFB000"
        >{{filterStutes(order?.status)}}</view>
      </view>
      <view
        class="ss-flex justify-between font-1 ss-m-b-10"
        v-for="(item,index) in order?.item"
        :key="index"
      >
        <view
          class="ss-line-1"
          style="width:416rpx"
        >{{item.goods_title}}</view>
        <view
          class="font-0"
          style="color:#9A9A9A"
        >X{{item.goods_num}}</view>
      </view>
      <view class="text-right font-1 font-w s-m-t-20">
        实付￥{{order?.pay_fee||2}}
      </view>
    </view>
  </view>
</template>

<script setup>
import sheep from '@/sheep';
import {
  reactive,
  computed
} from 'vue';
import {
  onLoad
} from '@dcloudio/uni-app';
const props = defineProps({
  dataList: {
    type: Array,
    default: []
  }
})
const filterStutes = (val) => {
  switch (val) {
    case 'closed':
      return '交易关闭'
    case 'cancel':
      return '已取消'
    case 'unpaid':
      return '未支付'
    case 'paid':
      return '已支付'
    case 'completed':
      return '已完成'
    case 'pending':
      return '待定'
    default:
      return '-'
  }
}

</script>

<style lang="scss" scoped>
.img-box {
  border-radius: 10rpx;
  overflow: hidden;
  width: 114rpx;
  height: 114rpx;
}
</style>